<template>
	<view class="container">
		<!-- 顶部导航部分 -->
		<view class="top">
			<view class="bg"></view>
			
			<view class="title_header">
				<view class="jiantou" @click="back"></view>
				<text>活动发布</text>
			</view>
		
		
		
		<!-- 卡片中内容 -->
		<view>
			<uni-card>
				<view class="titletime">
					<text class="one">标题:</text>
					<input v-model="title"></input>
				</view>
				
				<view class="neirong">
					<text class="one">内容:</text>
					<textarea class="wenben" v-model="content"></textarea>
				</view>
				
				<view class="imgvideo">
					<text class="three">图片/视频:</text>
					<!-- <view class="border"> -->
						<uni-file-picker>
							<view class="select">
								<image src="../../static/image/加号.png"></image>
								<text class="shangchuan">点击选择上传</text>
							</view>
						</uni-file-picker>
					<!-- </view> -->
				</view>
			</uni-card>
		</view>
		
		<!-- 发布按钮 -->
		<view class="fabu" @click="AddActiveLaunch">
			发布
		</view>
	</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				//新增数据字段定义
				title:"",
				content:"",
			}
		},
		methods: {
			//活动发布页面新增接口调用
			AddActiveLaunch(){
				if(this.title == null || this.content == null || this.title == ""  || this.content == ""){
					return;
				}
				uni.request({
					url:" http://localhost:8080/seller/ActiveLaunch/addActive",
					data:{
						"title": this.title,
						"content": this.content,
						"type": 0,
						"state": 1
					},
					method:'post',
					header: {
					    'Authorization':'Bearer '+getApp().globalData.userInfo.token
					},
					success: (res) => {
						// console.log("活动发布页面数据新增:",res)
						if(res.data.code == 200){
							console.log("添加成功");
							this.title="";
							this.content=""
						//添加成功以后跳转到上一页
						uni.reLaunch({
							url:"/pages/shop/homepage/homepage"
							
						})
						}
						
					}
				})
			},
			
			
			back(){
				uni.navigateBack({
					delta:1,
				})
			}
		}
	}
</script>

<style>
	/* 导航栏样式 */
	.container{
		width: 750rpx;
		position: relative;
	}
	.top{
		width: 750rpx;
		height: 400rpx;
		background-color: #3785f6;
	}
	.bg{
		position: absolute;
		z-index: -1;
		background-color: #3785f6;
		width: 750rpx;
		height: 450rpx;
	}
	.title_header{
		display: flex;
		padding-top: 60rpx;
	}
	.title_header>text{
		font-size: 35rpx;
		color: white;
		margin-left: 270rpx;
	}
	.jiantou{
		border-bottom: 6rpx solid white;
		border-left: 6rpx solid white;
		width: 20rpx;
		height: 20rpx;
		margin-left: 20rpx;
		transform: rotate(45deg);
	}
	
	
	/* 卡片内容样式 */
	.titletime{
		display: flex;
		color: #151515;
		line-height: 88rpx;
		align-items: center;
	}
	
	.titletime .one{
		width: 150rpx;
	}
	.titletime>input{
		width: 470rpx;
		height: 56rpx;
		border:1rpx solid #c3c3c3;
		border-radius: 20rpx;
		padding-left: 15rpx;
	}
	.neirong{
		padding-top: 15rpx;
		display: flex;
		color: #151515;
	}
	.neirong .one{
		width: 150rpx;
	}
	.neirong .wenben{
		width: 470rpx;
		border: 1rpx solid #c3c3c3;
		border-radius: 20rpx;
		padding-left: 12rpx;
	}
	
	.imgvideo{
		padding-top: 27rpx;
		padding-bottom: 15rpx;
		display: flex;
		color: #151515;
	}
	.select image{
		width: 20rpx;
		height: 20rpx;
	}
	.imgvideo .three{
		width: 150rpx;
	}
	.select{
		display: flex;
		flex-direction: column;
		font-size: 25rpx;
		color: #c3c3c3;
		align-items: center;
		
		
	}
	.select .shangchuan{
		padding-top: 10rpx;
		width: 150rpx;
		height: 80rpx;
		
	}
	.border{
		border: 1rpx solid #c3c3c3;
		border-radius: 15rpx;
	}
	.file-picker__box{
		
		padding-top: 300rpx !important;
		padding-left: 300rpx;
	}
	
	/* 发布按钮样式 */
	.fabu{
		line-height: 77rpx;
		width: 517rpx;
		height: 70rpx;
		border: 1rpx solid  white;
		border-radius: 30rpx;
		text-align: center;
		margin-left: 120rpx;
		margin-top: 60rpx;
		color: white;
		background-color: #3785f6;
	}

</style>
